<template>
  <div>
    <h4 class="title">
      {{ getTitle(paramVo) }}
    </h4>

    <my-descript :show-str="paramVo.paramDesc" class="desc" :write-flag="writeFlag"
                 @update="updateParam"/>

    <field-table-read :write-flag="writeFlag" :table-data="paramVo.fields"
                      @custom-event="updateBeginSet"/>
  </div>

  <el-dialog :title="updateTitle" v-model="upsertFlag" width="1090px" draggable>
    <field-update :param-desc="paramVo"/>

    <div slot="footer" class="dialog-footer" style="margin-top: 4px">
      <el-button @click="upsertFlag = false">取 消</el-button>
      <el-button type="primary" @click="upsertParamDesc">保 存</el-button>
    </div>
  </el-dialog>

  <el-dialog :title="updateParamTitle" v-model="updateParamFlag" draggable>
    <el-form :model="paramVo" label-width="120px" ref="updateParam">
      <el-form-item label="参数名称">
        <el-input v-model="paramVo.title"></el-input>
      </el-form-item>
      <el-form-item label="参数描述">
        <el-input v-model="paramVo.paramDesc" type="textarea"/>
      </el-form-item>
    </el-form>
    <div slot="footer" class="dialog-footer">
      <el-button @click="updateParamFlag = false">取 消</el-button>
      <el-button type="primary" @click="upsertParamDesc">确 定</el-button>
    </div>
  </el-dialog>
</template>

<script>
import FieldTableRead from "@/components/field/FieldTableRead";
import FieldUpdate from "@/components/field/FieldUpdate";
import myaxios from "@/plugins/myaxios";
import {ElMessage} from "element-plus";
import MyDescript from "@/components/util/MyDescript";

export default {
  name: "ParamDescOne",
  components: {
    MyDescript,
    FieldUpdate,
    FieldTableRead
  },
  props: {
    paramVo: {
      type: Object,
      required: true
    },
    writeFlag: {
      type: Boolean,
      default: false
    }
  },
  data() {
    return {
      upsertFlag: false,
      updateTitle: '修改参数说明字段',
      updateParamFlag: false,
      updateParamTitle: '修改参数信息'
    }
  },
  methods: {
    getTitle(data) {
      let title = data.title
      if (!title) {
        title = "无数据"
      }
      this.updateTitle = '《' + title + '》修改'
      return data.title
    },
    upsertParamDesc() {
      myaxios.post("/dist/api/upsertParamDesc", this.paramVo).then(rep => {
        // 处理rep
        if (rep.data.code !== 100) {
          ElMessage.error(rep.data.msg);
          return;
        }
        ElMessage.success("修改成功。");
        this.upsertFlag = false
        this.updateParamFlag = false
      }, err => {
        ElMessage.error(err.response.data)
      })
    },
    updateBeginSet(flag) {
      this.upsertFlag = flag
    },
    updateParam() {
      // gpt优化
      this.updateParamFlag = true;
      let dataType = '';
      let paramType = '';

      if (this.paramVo.paramType === 4) {
        this.updateParamTitle = `修改《${this.paramVo.title}》参数信息`;
      } else {
        const allEnum = this.$store.state.allEnum;
        const dateType = allEnum.paramDataType.find((item) => item.enumValue === this.paramVo.dataType);
        dataType = dateType ? dateType.enumName : '';

        paramType = allEnum.paramType.find((item) => item.enumValue === this.paramVo.paramType).enumName;

        this.updateParamTitle = `修改${dataType}${paramType}说明`;
      }

    }
  }
}
</script>

<style scoped>
.title {
  text-align: center;
  margin: 16px 0 -4px 0;
}

.desc {
  text-align: left;
}
</style>